<!DOCTYPE html>
<html lang="zh">
<head>
	<meta charset="UTF-8" />
	<meta name="viewport" content="width=device-width, initial-scale=1.0" />
	<meta http-equiv="X-UA-Compatible" content="ie=edge" />
	<link rel="stylesheet" type="text/css" href="__HOME__/css/fenxiao.css"/>
	<script src="__HOME__/js/jquery.min.js"></script>
	<script type="text/javascript" src="__HOME__/layer/layer.js"></script>
	<title>分销页面</title>
</head>
<body>
	<!--未申请分销-->
	<div class="conter" id="unfinished">
		<div class="header">
			<div class="header-l">
				<a href="javascript:history.back(-1)">
					<img src="__HOME__/images/top_arrowleft.png" alt="" />
				</a> 
			</div>
			<p>分销中心</p>
		</div>
		<img src="__HOME__/images/fen2.png" alt="" />
		<p class="wsq">您还没有申请成为分销商请申请成为分销商</p>
		<button class="sqfx" id="apply">申请分销</button>
	</div>
	
	<!--申请分销页面-->
	<div class="wrap" id="finishing">
		<div class="header">
			<div class="header-l">
				<a href="javascript:location.reload();">
					<img src="__HOME__/images/top_arrowleft.png" alt="" />
				</a> 
			</div>
			<p>申请分销</p>
		</div>
		<div class="Info">
			<form method="post">
				<ul>
					<li>
						<p>*真实姓名：</p>
						<input type="text" name="name" id="name" placeholder="请输入真实姓名" />
					</li>
					<li>
						<p>*身份证：</p>
						<input type="text" name="birthday" id="card" placeholder="请输入身份证" />
					</li>
					<li>
						<p>*手机号：</p>
						<input type="text" name="mobile" id="phonenum" placeholder="请输入手机号"/>
					</li>
				</ul>
			</form>
		</div>	
		<a href="#">【分销协议】</a>
		<p>带*号的为必填项</p>
		<button id="sub" type="button">提交申请</button>
	</div>

	<!--已申请分销页面-->
	<div class="row" id="finished">
		<div class="header">
			<div class="header-l">
				<a href="javascript:history.go(-1);">
					<img src="__HOME__/images/top_arrowleft.png" alt="" />
				</a> 
			</div>
			<p>已申请分销</p>
		</div>
		<img src="__HOME__/images/fen1.png" alt="" />
		<p class="sq">您申请成为分销商正在审核中请耐心等候...3秒后返回</p>
	</div>	
</body>

<script type="text/javascript">

	//获取id
	var apply = document.getElementById("apply");
	var sub = document.getElementById("sub");
	var finished = document.getElementById("finished");
	var unfinished = document.getElementById("unfinished");
	var finishing = document.getElementById("finishing");

	//定义url
	var urlInfo = "{:url('index/sub')}";	
	
	//接收后台渲染的用户会员级别
	var statecheck = "{$statecheck}";   

	//判断会员级别，来展示相应页面
	if(statecheck == 0){
		
		unfinished.style.display="block";

		//点击申请分销后，显示申请页面
		apply.onclick = function(){
			unfinished.style.display="none";
			finishing.style.display="block";

			//点击提交申请,关闭申请页面，跳转到返回页，3秒后返回首页。
			sub.onclick = function(){
				
				
				//获取输入框里的值
				var name =  $("#name").val();
				var card =  $("#card").val();
				var phonenum =  $("#phonenum").val();

				//真实姓名输入验证
				var regstr = /^[\u4e00-\u9fa5]{2,4}$/;
				if(!regstr.test(name)){
					layer.msg("姓名不规范");
					return;
				}

				//身份证号码输入验证
				var reg = /(^\d{15}$)|(^\d{17}(\d|X)$)/; 
				if(!reg.test(card)){
				 	layer.msg("身份证不规范");
				 	return;
				}
				
				//手机号码输入验证
				var regphone = /^1[34578]\d{9}$/;
				if(!regphone.test(phonenum)){
				 	layer.msg("手机号码不规范");
				 	return;
				}
				

				//发送数据
				$.post(urlInfo,
					{
                      	name:name,
						birthday:card,
						mobile:phonenum
					},
					function(data,code){
    					if(data.code==1){
    						layer.msg('success');
    						//发送成功才显示已提交
							finishing.style.display="none";
							finished.style.display ="block";
    					}else if(data.code==0){
    						layer.msg('error');
    					}else{
    						layer.msg('网络错误，请稍后再试！！');
    					}
					}

				);

			}

		}
		
	}else if(statecheck == 1){
		unfinished.style.display="none";
		finished.style.display="block"; 
	}else if(statecheck == 2 || statecheck == 3){
		window.location.href = "{:url('yifenxiao')}";
	}else{
		layer.msg("您还没有登录");
	}
</script>
</html>